<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>嵩县全域智慧旅游产业大数据和决策分析云平台</title>
    <link rel="stylesheet" href="../../assets/css/public.css">
    <link rel="stylesheet" href="../../assets/css/common.css">
    <link rel="stylesheet" href="../../assets/css/index.css">
    <link rel="stylesheet" href="../../assets/css/animate.min.css">
</head>
<body>
    <div class="box">
        <!--头部-->
        <div class="title-box">
            <div class="title-left">
                <span id="weather">小雨转晴</span>
                <span id="temperature">32/23℃</span>
                <span id="windPower">东风</span>
            </div>
            <div class="title-img">
                <h3>嵩县全域智慧旅游产业大数据和决策分析云平台</h3>
                <img src="../../assets/images/title-bg.png">
            </div>
            <div class="title-right">
                <a href="../admin/index.html">运营管理</a>
            </div>
        </div>
        <!--主体-->
        <div class="main-box">
            <!--导航-->
            <div class="nav-box">
                <ul>
                    <li class="active">
                        <a href="#">
                            <div>
                                <img src="../../assets/images/icon-index.png">
                                <img src="../../assets/images/icon-index-active.png">
                            </div>
                            <p>旅游发展环境</p>
                        </a>
                    </li>
                    <li>
                        <a href="../basicElements/index.html">
                            <div>
                                <img src="../../assets/images/icon-analysis.png">
                                <img src="../../assets/images/icon-analysis-active.png">
                            </div>
                            <p>旅游基础要素</p>
                        </a>
                    </li>
                    <li>
                        <a href="../touristFlow/index.html">
                            <div>
                                <img src="../../assets/images/icon-image.png">
                                <img src="../../assets/images/icon-image-active.png">
                            </div>
                            <p>旅游客流监测</p>
                        </a>
                    </li>
                    <li>
                        <a href="../touristsPortrait/index.html">
                            <div>
                                <img src="../../assets/images/icon-portrait.png">
                                <img src="../../assets/images/icon-portrait-active.png">
                            </div>
                            <p>游客画像分析</p>
                        </a>
                    </li>
                    <li>
                        <a href="../tourismEnterprises/index.html">
                            <div>
                                <img src="../../assets/images/icon-operation.png">
                                <img src="../../assets/images/icon-operation-active.png">
                            </div>
                            <p>旅游企业监测</p>
                        </a>
                    </li>
                    <li>
                        <a href="../pinglun/index.html">
                            <div>
                                <img src="../../assets/images/icon-pinglun.png">
                                <img src="../../assets/images/icon-pinglun-active.png">
                            </div>
                            <p>互联网评论</p>
                        </a>
                    </li>
                </ul>
            </div>
            <!--数据内容-->
            <div class="content-box flex-column">
                <div class="content-nav">
                    <ul>
                        <li class="active">
                            <a href="#">旅游发展环境</a>
                        </li>
                        <li>
                            <a href="weather.html">环境气象监测</a>
                        </li>
                        <li>
                            <a href="traffic.html">交通监测</a>
                        </li>
                    </ul>
                </div>
                <div class="content-main flex-row flex1">
                    <div class="content-left">
                        <div class="heroic-box animated bounceInDown">
                            <div class="content-title">
                                旅游产业要素
                            </div>
                            <div class="content-left-main">
                                <ul>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/jingqu.png">
                                        </div>
                                        <div class="heroic-content">
                                           <b>12</b>
                                           <p>景区</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/zhusu.png">
                                        </div>
                                        <div class="heroic-content">
                                            <b>137</b>
                                            <p>住宿</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/canyin.png">
                                        </div>
                                        <div class="heroic-content">
                                            <b>143</b>
                                            <p>餐饮</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/gouwu.png">
                                        </div>
                                        <div class="heroic-content">
                                            <b>125</b>
                                            <p>购物</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/lvxingshe.png">
                                        </div>
                                        <div class="heroic-content">
                                            <b>4</b>
                                            <p>旅行社</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="img-box">
                                            <img src="../../assets/images/wc.png">
                                        </div>
                                        <div class="heroic-content">
                                            <b>131</b>
                                            <p>厕所</p>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="voice-box bounceInLeft animated">
                            <div class="content-title">
                                热门目的地排行TOP5
                            </div>
                            <div class="content-left-main">
                                <ul>
                                    <li>
                                        <i>1</i>
                                        <span>白云山 </span>
                                        <b></b>
                                        <strong>7168</strong>
                                    </li>
                                    <li>
                                        <i>2</i>
                                        <span>天池山</span>
                                        <b></b>
                                        <strong>3089</strong>
                                    </li>
                                    <li>
                                        <i>3</i>
                                        <span>木扎岭 </span>
                                        <b></b>
                                        <strong>1520</strong>
                                    </li>
                                    <li>
                                        <i>4</i>
                                        <span>白云小镇</span>
                                        <b></b>
                                        <strong>1169</strong>
                                    </li>
                                    <li>
                                        <i>5</i>
                                        <span>石头部落</span>
                                        <b></b>
                                        <strong>1013</strong>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="flex1 traffic-box animated rotateInUpLeft">
                            <div class="content-title">
                                重点景区客流
                            </div>
                            <div class="content-left-main flex1">
                                <div class="flex1" id="index1-1"></div>
                            </div>
                        </div>
                        <div class="flex1 traffic-box bounceInUp animated">
                            <div class="content-title">
                                网络评价好中差评占比
                            </div>
                            <div class="content-left-main flex1">
                                <div class="flex1 flex-row">
                                    <div class="flex1" id="index1-2-1"></div>
                                    <div class="flex1" id="index1-2-2"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="content-center">
                        <div class="data-box content-center-bg flipInY animated">
                            <ul>
                                <li>
                                    <div>
                                        <i><img src="../../assets/images/index-title1.png"></i>
                                        <b>客流量(人次)</b>
                                    </div>
                                    <span class="numberStyle">55816</span>
                                </li>
                                <li>
                                    <div>
                                        <i><img src="../../assets/images/index-title2.png"></i>
                                        <b>流入量(人次)</b>
                                    </div>
                                    <span class="numberStyle">19606</span>
                                </li>
                                <li>
                                    <div>
                                        <i><img src="../../assets/images/index-title3.png"></i>
                                        <b>流出量(人次)</b>
                                    </div>
                                    <span class="numberStyle">26100</span>
                                </li>
                            </ul>
                        </div>
                        <div id="index_2">
                            <div class="index-prop bounceInDown animated">
                                <h3>白云山</h3>
                                <p>实时客流量: 3954人</p>
                                <p>今日客流量: 7168人</p>
                            </div>
                            <img src="../../assets/images/map-img.png" alt="">
                        </div>
                        <div class="flex1 content-center-bg time-box bounceInUp animated">
                            <div class="index-title">近七天客流量分析</div>
                            <div class="flex1" id="index_3"></div>
                        </div>
                    </div>
                    <div class="content-right">
                        <div class="content-right-top">
                            <div class="content-right-bg  flex1 fadeInDown animated">
                                <div class="content-title">
                                    年龄性别占比
                                </div>
                                <div class="content-left-main flex1" id="index_4">

                                </div>
                            </div>
                            <div class="content-right-bg  flex1 rotateInUpRight animated">
                                <div class="content-title">
                                    过夜游停留时长
                                </div>
                                <div class="content-left-main flex1 " id="index_5">

                                </div>
                            </div>
                            <div class="content-right-bg sex-box flex1 animated rotateInUpRight">
                                <div class="content-title">
                                    游客出行方式
                                </div>
                                <div class="content-left-main flex1" id="index_6">

                                </div>
                            </div>
                            <div class="content-right-bg flex1 bounceInUp animated sex-box">
                                <div class="content-title">
                                    <p>客源省TOP5</p>
                                    <p class="hd">客源城市TOP5</p>
                                    <img class="change" src="../../assets/images/change.png" alt="">
                                </div>
                                <div class="content-left-main flex1" id="index_7">

                                </div>
                            </div>
                        </div>

                    </div>
                </div>

            </div>
        </div>
    </div>
</body>
<script src="../../assets/plugin/jquery.min.js"></script>
<script src="../../assets/plugin/ECharts/echarts.js"></script>
<script src="../../assets/plugin/ECharts/china.js"></script>
<script src="../../assets/plugin/jquery.leoTextAnimate.js"></script>
<script src="../../assets/js/public.js"></script>
<script src="../../assets/js/index.js"></script>
</html>
